<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <title>选择城市</title>
    <style>
        * {
            margin: 0;
            padding: 0;
            text-align: center;
        }
    </style>
    <script src="js/alert.js"></script>
    <link rel="stylesheet" href="https://cdn.staticfile.org/font-awesome/4.7.0/css/font-awesome.css">
</head>
<body>
<div>
    <div style="font-size: 30px;margin-top: 5%;">你所在的城市?</div>
</div>
<div style="margin-top: 25%;">
    <i style="font-size: 80px" class="fa fa-map-marker" aria-hidden="true"></i>
</div>
<div style="text-align: center;margin-top: 3%;">
    <div id="loca" onclick="loca()" style="padding: 3%;margin-left: 27%;color:#fff;width: 40%;font-size: 17px;background-color: #0f182e;border-radius: 100px/100px;">
        自动获取位置
    </div>
    <div style="color:#c1bd47;font-size: 14px;margin: 7%;">手动更改城市</div>
</div>

<div id="goon" style="padding: 3%;margin-left: 15%;color: #fff; width: 65%;font-size: 17px;background-color: #0f182e;border-radius: 100px/100px;margin-top: 50%;">
    继续
</div>

</body>
<script src="js/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script>
    var boll = false;

    $("#goon").click(function () {
        if (!boll) {
            return
        }
        location.href="choice-store.html";//选择门店
    });

    $(document).ready(function () {
        run();
    });

    function run() {
        var url = window.location.href;
        $.ajax({
            "url": "/wechat/weizhi/",
            "data": "uri=" + url,
            "type": "POST",
            "dataType": "json",
            "success": function (json) {
                var map = json.data;
                wxconfig(map);
            }
        })
    }

    function wxconfig(data) {

        wx.config({
            //debug: data.debug, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
            appId: data.appId, // 必填，公众号的唯一标识
            timestamp: data.timestamp, // 必填，生成签名的时间戳
            nonceStr: data.nonceStr, // 必填，生成签名的随机串
            signature: data.signature,// 必填，签名
            jsApiList: ['getLocation'] // 必填，需要使用的JS接口列表
        });

        /*wx.error(function (res) {

        });*/
    }

    function loca() {

        wx.getLocation({
            type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
            success: function (res) {
                var latitude = res.latitude; // 纬度，浮点数，范围为90 ~ -90
                var longitude = res.longitude; // 经度，浮点数，范围为180 ~ -180。
                var speed = res.speed; // 速度，以米/每秒计
                var accuracy = res.accuracy; // 位置精度

                $.ajax({
                    url: "https://api.map.baidu.com/geocoder/v2/?ak=2GhAjyOSR2zqbv2o4MaMIEHY3ieP1ixC&callback=renderReverse&location=" + latitude + "," + longitude + "&output=json&pois=1",
                    type: "get",
                    dataType: "jsonp",
                    jsonp: "callback",
                    success: function (data) {
                        var province = data.result.addressComponent.province;
                        var cityname = (data.result.addressComponent.city);
                        var district = data.result.addressComponent.district;
                        var street = data.result.addressComponent.street;
                        var street_number = data.result.addressComponent.street_number;
                        var address = data.result.formatted_address;

                       $("#loca").html(province+','+cityname);
                       boll = true;
                        setCity(cityname);
                    }
                });
            }
        });
    }

    function setCity(city) {
        $.ajax({
            "url": "/store/setcity/",
            "data": "city=" + city,
            "type": "POST",
            "dataType": "json",
            "success": function (json) {

            },
            "error":function() {
                location.href = "blank.html";
            }
        })
    }

</script>
</html>